<header  class="bar bar-header  bar-stable bar-mycolor " >
    <a class="button button-clear icon ion-ios-arrow-left" href="#/tab/friends" ></a>
      <h1 class="title ">茶友</h1>
</header>


<header  class="bar bar-subheader  bar-stable bar-mycolor " >
	<div class="row row-center bk-white row-margin">
		<div class="content-center">
			<button class="bt-style2 " ng-class="{'bt-active2':isRenQiActive}" ng-click="changeToRenQi()">人气</button>
			<button class="bt-style2"  ng-class="{'bt-active2':isLiveActive}" ng-click="changeToLive()">活跃</button>
      <button class="bt-style2"  ng-class="{'bt-active2':isPointActive}" ng-click="changeToPoint()">积分排行</button>
      <button class="bt-style2"  ng-class="{'bt-active2':isTeaBActive}" ng-click="changeToTeaB()">茶币排行</button>
		</div>
	</div>
</header>

<ion-content class="has-subheader bk-gray" ng-init="loadData('fans')">
      <div class="friends_rank_item" ng-repeat="u in recList">
        <div ng-class="{'circle_number_red':u.pos === 0,
                        'circle_number_green':u.pos === 1,
                        'circle_number_orange':u.pos === 2,
                        'box_20px': true}"
        >
            <span>{{u.pos + 1}}</span>
        </div>

        <div class="friends_rank_item_avatar" ng-click="goToUserDetailPage(u.id)"><img class="circle_img_60px" src="{{u.avatar}}"></div>

        <div class="friends_rank_item_txt_area">
            <p>{{u.nickname}}</p>
            <p><a class="friends_rank_item_txt_area_icon ion ion-location"></a>{{u.address}}</p>
        </div>

        <div class="friends_rank_item_txt_value">{{u.value}}{{typeName}}</div>
      </div>

      <!-- <div class="item" ng-repeat="u in recList">
          <div class="row">
              <div class="col-10">
                  <div ng-class="{'circle_number_red':u.pos === 0}"
                       ng-class="{'circle_number_green':u.pos === 1}"
                       ng-class="{'circle_number_orange':u.pos === 2}">
                      <span>{{u.pos + 1}}</span>
                  </div>
              </div>
              <div class="col"><img class="circle_img_80px" src="{{u.avatar}}"></div>
              <div class="col-40">
                  <p>{{u.nickname}}<span><a class="ion ion-happy"><a class="ion ion-happy"></a></span></p>
                  <p>
                      <a class="ion ion-happy"></a>{{u.address}}</p>
              </div>
              <div class="col">{{u.value}}{{typeName}}</div>
          </div>
      </div> -->
</ion-content>
